<template>
  <div>
    <!-- 回显填写的信息 -->
    <el-form
      disabled
      label-position="right"
      label-width="120px"
      :model="formData"
      :inline="true"
    >
      <el-form-item :rules="[{ required: true }]" :label="$t('page.formula')">
        <el-radio-group v-model="formData.formulaValue">
          <el-radio :label="0">{{ $t("page.default") }}</el-radio>
          <el-radio :label="1">{{ $t("page.newFormula") }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="formData.formulaValue === 1">
        <el-select v-model="formData.formulaItem" placeholder="请选择公式">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.name"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item
        :rules="[{ required: true }]"
        :label="`${$t('page.label')}${$t('public.type')}`"
      >
        <el-radio-group v-model="formData.mmolType">
          <el-radio :label="0"
            >{{ $t("page.quality") }}{{ $t("page.label") }}</el-radio
          >
          <el-radio :label="1"
            >{{ $t("page.Moore") }}{{ $t("page.label") }}</el-radio
          >
        </el-radio-group>
      </el-form-item>
      <el-form-item
        v-if="formData.mmolType === 0"
        :rules="[{ required: true }]"
        :label="$t('page.unit')"
      >
        <el-radio-group v-model="formData.unit">
          <el-radio :label="v" v-for="(v, i) in unitOption" :key="i">
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        :rules="[{ required: true }]"
        v-if="formData.mmolType === 0"
        :label="`${$t('page.molecular')}(Da)`"
      >
        <el-input type="number" v-model="formData.mole" style="width:250px;">
        </el-input>
      </el-form-item>
      <el-form-item
        :rules="[{ required: true }]"
        v-if="formData.mmolType === 1"
        :label="$t('page.unit')"
      >
        <el-radio-group v-model="formData.mass">
          <el-radio label="M">M</el-radio>
          <el-radio label="nM">nM</el-radio>
          <el-radio label="uM">uM</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        :rules="[{ required: true }]"
        :label="$t('page.zeroProcess')"
      >
        <el-radio v-model="formData.zero" label="0">{{
          $t("page.zero")
        }}</el-radio>
        <el-radio v-model="formData.zero" label="1">{{
          $t("page.noZero")
        }}</el-radio>
      </el-form-item>
      <el-form-item :rules="[{ required: true }]" :label="$t('page.fit_opt')">
        <el-radio v-model="formData.fitting" :label="0">{{
          $t("page.default")
        }}</el-radio>
        <el-radio v-model="formData.fitting" :label="1">{{
          $t("page.optimization")
        }}</el-radio>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import FormParameter from './form_parameter.vue'
export default {
  props: {
    otherParams: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      options: [
        {
          name: "b + a*( exp(c*x)-1 )/c",
          value: 1,
        },
        {
          name: "a*exp(-x/c) + b",
          value: 2,
        },
        {
          name: "a+exp(c*x)",
          value: 3,
        },
        {
          name: "c - exp(-a*x)",
          value: 4,
        },
        {
          name: "b+a*exp(c*x)",
          value: 5,
        },
      ],
      unitOption: ["pg/ml", "ng/ml", "μg/ml", "mg/ml"],
      formData: {
        formulaValue: 0,
        formulaItem: "",
        mmolType: 0,
        unit: "",
        mole: '',
        mass: "M",
        zero: "0",
        fitting: 0,
      },
    };
  },
  watch: {
    otherParams: {
      handler(val) {
        console.log(val, '到了');
        if(!val || !val.hasOwnProperty('unit')) return
        this.$nextTick(() => {
          this.formData.unit = val.unit || ''
          this.formData.mole = val.mole || ''
          this.formData.formulaValue = +val.formulas
          this.formData.mmolType = +val.quality
          this.formData.zero = val.zero
          this.formData.fitting = +val.fit_opt
          this.$forceUpdate()
        })
      },
      deep: true
    }
  }
};
</script>
